<template>
	<div id="editaddress">
		<div class="editadd-top">
			<img src="../../assets/address/zuo.png" />
			<p>编辑收货地址</p>
			<router-link to="/home/mine">
				<span>保存</span>
			</router-link>
		</div>
		<div class="body_address" v-for="iten in xlist">
			<div class="addresses">
				<p>{{iten.ask}}</p>
				<input type="text" :placeholder="iten.answer" />
			</div>
		</div>
	</div>
</template>

<script>
	export default{
		data(){
			return{
				xlist:[
					{
						ask:"所在城市：",
						answer:"北京市"
					},{
						ask:"小区/大厦/学校：",
						answer:"理工大学国防科技园"
					},
					{
						ask:"楼号-门牌号：",
						answer:"A号楼B层"
					},{
						ask:"收货人：",
						answer:"傻娟"
					},
					{
						ask:"联系电话：",
						answer:"18911023277"
					}
				]
			}
		}
	}
</script>

<style scoped>
	#editaddress{
		margin: 0;
		padding: 0;
		height: 100%;
		position: fixed;
		width: 100%;
		background:#f8f8f8;
	}
	.editadd-top{
		display: flex;
		justify-content: space-between;
		padding-left:20px ;
		padding-right:20px ;
		margin-bottom: 12px;
		align-items: center;
		text-align: center;
		height: 44px;
		background: #FFFFFF;
	}
	.editadd-top img{
		height: 16px;
		width: 9.3px;
	}
	.editadd-top p{
		font-size: 16px;
	}
	.editadd-top span{
		font-size: 14px;
	}
	.body_address{
		background: #FFFFFF;
	}
	.addresses{
		display: flex;
		align-items: flex-end;  
		border-bottom: 1px solid #F1F1F1;
		margin-left: 18px;
		margin-right: 18px;
		padding-top: 12px;
	}
	.addresses input{
		border: none;
		outline:medium;
		height: 40px;
		width: 60%;
	}
	::placeholder{
		color: #666666;
		font-size: 14px;
	}
	.addresses p{
		font-size: 14px;
		color: #999999;
		padding-bottom: 12px;
	}
</style>
